<template>
  <div class="app">
    <myNavbar title="人工报单"></myNavbar>
    <list>
      <cell>
        <div class="address_box">
          <div @click="memberClick" v-if="from.memberId != ''">
            <div class="address_top">
              <text class="address_name">{{ memberName }}</text>
              <text class="address_phone">{{ memberPhone }}</text>
              <div class="details_lines" v-if="memberType == true"></div>
              <text class="details_right_copyTwo" v-if="memberType == true" @click="memberDetailsClick">详情</text>
            </div>
          </div>
          <div class="address_no" @click="memberClick" v-if="from.memberId == ''">
            <text class="address_no_title">点击选择会员</text>
          </div>
          <div class="address_right">
            <icon content="ios-arrow-forward" class="address_right_icon"></icon>
          </div>
        </div>

        <div class="address_box" v-if="from.memberId != ''">
          <div @click="addressClick" v-if="from.receiverId != ''">
            <div class="address_top">
              <text class="address_name">{{ from.consignee }}</text>
              <text class="address_phone">{{ from.phone }}</text>
            </div>
            <text class="address_content">{{ from.address }}</text>
          </div>
          <div class="address_no" @click="addressClick" v-if="from.receiverId == ''">
            <text class="address_no_title">点击选择地址</text>
          </div>
          <div class="address_right">
            <icon content="ios-arrow-forward" class="address_right_icon"></icon>
          </div>
        </div>
        <div class="submit_product">
          <div style="width: 640px;overflow: hidden">
            <div class="submit_product_content_box"
                 v-for="(item,index) in orderForm.itemList"
                 ref="itemDev" @swipe="handleSwipe($event,index)">
              <image class="submit_product_content_img" :src="item.thumbnail"></image>
              <div
                  style="width: 450px;display: flex;flex-direction: column;justify-content: space-between;margin-left: 20px">
                <div class="submit_product_content">
                  <text class="submit_product_content_title">{{ item.name }}</text>
                  <text class="submit_product_content_subtitle">{{ item.spec }}</text>
                  <div class="submit_product_content_row"></div>
                </div>
                <div class="submit_product_number">
                  <div class="product_botton_box" style="display:flex;flex-direction:row;">
                    <div class="product_botton_left">
                      <text class="submit_product_priceIcon">¥</text>
                    </div>
                    <div @click="priceChange(index)" class="product_price_input">
                      <text class="product_price_input_Title">{{ item.price }}</text>
                    </div>
                    <div class="product_botton_right" @click="priceInputRight(index,item.productId)">
                      <text class="product_botton_icon">&#xe695;</text>
                    </div>
                  </div>
                  <div class="product_botton_box" style="display:flex;flex-direction:row;">
                    <div class="product_botton_left" @click="reductionClick(index)">
                      <text class="product_botton_icon">&#xe609;</text>
                    </div>
                    <div @click="numChange(index)" class="product_price_input">
                      <text class="product_price_input_Title">{{ item.quantity | number }}</text>
                    </div>

                    <div class="product_botton_right" @click="addClick(index)">
                      <text class="product_botton_icon">&#xe620;</text>
                    </div>
                  </div>
                </div>
                <div class="history_box" v-if="changePriceType == true && index == changePriceIndex"
                     @click="isMaskCancel">
                  <div class="history_cancel_box">
                    <text class="history_cancel_icon">&#xe61a;</text>
                  </div>
                  <div class="history_content" @click="">
                    <div class='isMask_Price_header' v-if="historyForm.length > 0">
                      <text class="isMask_Price_header_title">销售日期</text>
                      <text class="isMask_Price_header_title">销售价格</text>
                    </div>
                    <div class='isMask_Price_box' v-for="items in historyForm" @click="isMaskChange(items.price)"
                         v-if="historyForm.length > 0">
                      <text style="font-size: 28px;flex:1;text-align: center">{{ items.createDate | formatDate }}</text>
                      <text class="isMask_Price_box_price">¥{{ items.price | price }}</text>
                    </div>
                    <div class="isMask_Price_box_Two" v-if="historyForm.length == 0">
                      <text class="isMask_Price_box_Two_Titlt">暂无历史价格</text>
                    </div>
                  </div>
                </div>
              </div>
              <div
                  style="background-color: #ff0000; width: 140px;justify-content: center; align-items: center;border-radius: 10px;margin-left: 20px"
                  @click="removeItem(index)">                    
                <text style="font-size: 30px; color:#ffffff">删除</text>
              </div>
            </div>
          </div>

          <div class="submit_subtotal" style="margin-bottom: 20px" v-if="itemList.length > 0">
            <text class="submit_subtotal_subtitle">共{{ orderForm.subQuantity }}件</text>
            <text class="submit_subtotal_title">小计：</text>
            <text class="submit_subtotal_Icon">¥</text>
            <text class="submit_subtotal_price">{{ orderForm.amountPayable }}</text>
          </div>

          <div class="submit_product_details" @click="couponsClick" v-if="itemList.length > 0">
            <text class="submit_product_details_title">店铺优惠</text>
            <div class="submit_product_detailsBox">
              <div style="display:flex;flex-direction:row;align-item:center">
                <text class="submit_product_details_IntroductionTwo" v-if="orderForm.discount>0">
                  {{ orderForm.discount | price }}
                </text>
                <text class="submit_product_details_IntroductionTwo" v-if="orderForm.discount==0">无优惠</text>
                <icon v-if="orderForm.discount>0" content="ios-arrow-forward"
                      class="submit_product_details_IconTwo"></icon>
              </div>
            </div>
          </div>
          <div class="submit_product_details" v-if="itemList.length > 0">
            <text class="submit_product_details_title">运费</text>
            <div class="submit_product_detailsBox">
              <div style="display:flex;flex-direction:row;align-item:center">
                <text class="submit_product_details_IntroductionTwo" v-if="orderForm.freight==0">包邮</text>
                <text class="submit_product_details_IntroductionTwo" v-if="orderForm.freight>0">
                  ¥{{ orderForm.freight }}
                </text>
              </div>
            </div>
          </div>
          <div class="submit_product_details" v-if="orderForm.itemList.length > 0">
            <text class="submit_product_details_title">订单备注</text>
            <div class="submit_product_detailsBox" @click="memoClick">
              <text class="submit_product_detailsBox_input">{{
                  orderForm.memo == "" ? '选填，请先和商家协商一致' : orderForm.memo
                }}
              </text>
            </div>
          </div>
          <div class="submit_subtotal" v-if="itemList.length > 0">
            <text class="submit_subtotal_subtitle">共{{ orderForm.subQuantity }}件</text>
            <text class="submit_subtotal_title">小计：</text>
            <text class="submit_subtotal_Icon">¥</text>
            <text class="submit_subtotal_price">{{ orderForm.amountPayable }}</text>
          </div>
          <div class="porduct_add" @click="shopAddClick">
            <text class="porduct_add_title">点击添加商品</text>
          </div>
        </div>
        <div class="submit_payMethod" v-if="itemList.length > 0 && orderForm.paymentVo.length>0">
          <div class="submit_payMethod_Header">
            <text class="submit_payMethod_Header_Title">支付方式</text>
          </div>
          <div class="submit_payMethod_Content" v-for="(item,index) in orderForm.paymentVo">
            <div class="submit_payMethod_Content_Column">
              <text class="submit_payMethod_Content_Title">{{ item.paymentPluginName }}</text>
              <text class="submit_payMethod_Content_SubTitle">可抵扣余额 ¥{{ item.balance }}</text>
              <text class="submit_payMethod_Content_Date" v-if="item.endDate !=underfind">
                有效期至：{{ item.endDate | formatTime }}
              </text>
            </div>
            <switch :key="times" :checked="item.chk" :disabled="item.chkType" @change="changeClick(index)"></switch>
          </div>
        </div>

        <div class="submit_payMethodTwo" v-if="itemList.length > 0">
          <div :class="[index !=3?'submit_payMethod_ContentTwo':'submit_payMethod_ContentThree']"
               v-for="(item,index) in pay"
               v-if="(item.isShow==true && item.paymentPluginId == 'paperPayPlugin') || item.paymentPluginId != 'paperPayPlugin'">
            <div class="submit_payMethod_Content_Row">
              <div>
                <image class="submit_payMethod_Content_Img" v-if="index == 0"
                       src="http://rzico-weex.oss-cn-hangzhou.aliyuncs.com/images/cashImg.png"></image>
                <image class="submit_payMethod_Content_Img" v-if="index == 1"
                       src="http://rzico-weex.oss-cn-hangzhou.aliyuncs.com/images/tickets.png"></image>
                <image class="submit_payMethod_Content_ImgTwo" v-if="index == 2"
                       src="http://rzico.oss-cn-shenzhen.aliyuncs.com/img/zhuanzhang1.png"></image>
                <image class="submit_payMethod_Content_Img" v-if="index == 3"
                       src="http://rzico.oss-cn-shenzhen.aliyuncs.com/img/yuejie.png"></image>
              </div>
              <text class="submit_payMethod_Content_Title">{{ item.paymentPluginName }}</text>
            </div>
            <switch v-if="item.isShow==true" :key="paytimes" :disabled="item.chkType"
                    @change="switchClick(index)"></switch>
          </div>
        </div>

        <div class="submit_payMethod" v-if="weekType == true">
          <div class="shippingInfo" @click="packageClick">
            <text class="shippingInfo_title">配送时间</text>
            <div class="shippingInfo_box">
              <div style="display:flex;flex-direction:row;align-item:center">
                <div style="display:flex;flex-direction:row;align-item:center"
                     v-for="(item,index) in weexDate">
                  <text class="submit_product_details_subtitle">{{ item.title }}</text>
                  <text class="submit_product_details_subtitle" v-if="index+1 != weexDate.length">、</text>
                </div>
                <icon content="ios-arrow-forward" class="submit_product_details_Icon"></icon>
              </div>
            </div>
          </div>
        </div>

        <div class="submit_payMethod">
          <div class="submit_payMethod_Header">
            <text class="submit_payMethod_Header_Title">配送信息</text>
          </div>
          <div class="shippingInfo" @click="methodClick" style="margin-top: 30px"
               v-if="orderForm.itemList.length > 0">
            <text class="shippingInfo_title">配送方式</text>
            <div class="shippingInfo_box">
              <div style="display:flex;flex-direction:row;align-item:center;height: 50px">
                <text class="shippingInfo_subtitle">{{ methodName }}</text>
                <icon content="ios-arrow-forward" class="submit_product_details_Icon"></icon>
              </div>
            </div>
          </div>
          <div class="shippingInfo" @click="siteClick" style="margin-top: 30px">
            <text class="shippingInfo_title">配送站点</text>
            <div class="shippingInfo_box">
              <div style="display:flex;flex-direction:row;align-item:center;height: 50px">
                <text class="shippingInfo_subtitle">{{ shopName }}</text>
                <icon content="ios-arrow-forward" class="submit_product_details_Icon"></icon>
              </div>
            </div>
          </div>
          <div class="shippingInfo" style="margin-top: 30px" @click="personnelClick"
               v-if="orderForm.shippingMethod == 2">
            <text class="shippingInfo_title">配送人员</text>
            <div class="shippingInfo_box">
              <div style="display:flex;flex-direction:row;align-item:center;height: 50px">
                <text class="shippingInfo_subtitle">{{ personnelName }}</text>
                <icon content="ios-arrow-forward" class="submit_product_details_Icon"></icon>
              </div>
            </div>
          </div>
        </div>
        <div style="width:750px;height:130px;"></div>
        <div class="submit_botton">
          <text class="submit_botton_subtitle">共{{ orderForm.subQuantity }}件 待付款</text>
          <text class="submit_botton_icon">¥</text>
          <text class="submit_botton_price">{{ amount }}</text>
          <button class="submit_botton_box botton_Bg_Color" @click="createClick" :text="payTitle"
                  :loading="payType"></button>
        </div>
        <shippingSite :shopIndex="shopIndex" v-if="siteType == true" @cencleSite="cencleSite"
                      @completeSite="completeSite"></shippingSite>
        <personnel :personnelIndex="personnelIndex" v-if="personnelType == true"
                   @completePersonnel="completePersonnel" @cenclePersonnel="cenclePersonnel"></personnel>
        <shippingMethod :methodIndex="methodIndex" :shippingMethod="shippingMethod" v-if="methodType"
                        @cencleMethod="cencleMethod" @completeMethod="completeMethod"></shippingMethod>
        <packagebox @cenclePackage="cenclePackage" @saveClick="saveClick"
                    v-if="packageType == true"></packagebox>
        <coupons :couponCodeName="couponCodeName" :promotions="orderForm.promotions"
                 @cenclecoupons="cenclecoupons" v-if="couponsType == true"></coupons>
      </cell>
    </list>
  </div>
</template>

<script>
import myNavbar from '../../../components/myNavbar/myNavbar.vue'
import packagebox from '../../../components/package/package.vue'
import shippingSite from './components/shippingSite.vue'
import coupons from './components/coupons.vue'
import personnel from './components/personnel.vue'
import {
  getMenuTree
} from '../../../api/sysMch.js'

const animation = weex.requireModule('animation');
const storage = weex.requireModule('storage');
import {calculate, saveAndConfirm, shipping, getHistoryList} from '@/api/order'
import {receiverLocation} from '@/api/mapLine'
import shippingMethod from './components/shippingMethod.vue'
import {list as addressList} from '@/api/address'
import {last} from '@/api/order'

export default {
  data() {
    return {
      calculate: {},
      delivery: {
        title: ''
      },
      deliveryType: false,
      submitType: false,
      address: {
        consignee: '',
        phone: '',
        areaName: '',
        address: ''
      },
      order_Details: {
        address: null
      },
      sn: '',
      orderId: '',
      amount: 0,
      shippingMethods: [],
      shippingMethod: '',
      distribution: [],
      paymentVo: [],
      check_shippingData: [],
      payType: false,
      isWaterShow: false,
      couponCodeName: '',
      itemList: [],
      // itemList: [],
      cashType: true,
      ticketType: false,
      siteType: false,
      personnelType: false,
      from: {
        memberId: '',
        operatorId: '',
        orderMethod: "1",
        shippingMethod: "0",
        officeId: '',
        areaName: "",
        address: "",
        areaId: '',
        receiverId: '',
        memo: '',
        phone: "",
        consignee: "",
        offsetAmount: 0,
        shopId: '',
        itemList: []
      },
      orderForm: {
        itemList: []
      },
      shopName: '',
      shopIndex: 0,
      personnelIndex: 0,
      personnelName: '',
      operatorId: '',
      shopId: '',
      times: null,
      paytimes: null,
      pay: [
        {
          amount: 0,
          chk: false,
          isShow: true,
          paymentPluginId: "cashPayPlugin",
          paymentPluginName: "现金(未收)",
          chkType: false,
          balance: 0
        },
        {
          amount: 0,
          chk: false,
          isShow: true,
          paymentPluginId: "paperPayPlugin",
          paymentPluginName: "纸质水票",
          chkType: false,
          balance: 0
        },
        {
          amount: 0,
          chk: false,
          isShow: true,
          paymentPluginId: "bankPayPlugin",
          paymentPluginName: "转账(已收)",
          chkType: false,
          balance: 0
        },
        {
          amount: 0,
          chk: false,
          isShow: true,
          paymentPluginId: "debtPayPlugin ",
          paymentPluginName: "月结欠款",
          chkType: false,
          balance: 0
        }
      ],
      methodType: false,
      methodName: '普通快递',
      methodIndex: '0',
      weexDate: [{title: '请选择配送日期'}],
      packageType: false,
      weexTime: '',
      weekType: false,
      couponsType: false,
      memberName: '',
      memberPhone: '',
      historyPrice: 0,
      historyForm: [],
      changePriceType: false,
      changePriceIndex: '',
      memberType: false,
      payTitle: '提交订单',
      historyData: []
    }
  },
  created() {
    this.initIconFont()
    this.shippingDate = this.currentDate(new Date())
    this.memberTypeClick()
    this.loadMenus()
  },
  components: {
    myNavbar, shippingSite, personnel, shippingMethod, packagebox, coupons
  },
  filters: {
    formatTime(value) {
      let date = new Date(value);
      let y = date.getFullYear();
      let MM = date.getMonth() + 1;
      MM = MM < 10 ? ('0' + MM) : MM;
      let d = date.getDate();
      d = d < 10 ? ('0' + d) : d;
      let h = date.getHours();
      h = h < 10 ? ('0' + h) : h;
      let m = date.getMinutes();
      m = m < 10 ? ('0' + m) : m;
      let s = date.getSeconds();
      s = s < 10 ? ('0' + s) : s;
      return y + '-' + MM + '-' + d + ' ' + h + ':' + m + ':' + s;
    },
    formatDate(value) {
      let date = new Date(value);
      let y = date.getFullYear();
      let MM = date.getMonth() + 1;
      MM = MM < 10 ? ('0' + MM) : MM;
      let d = date.getDate();
      d = d < 10 ? ('0' + d) : d;
      let h = date.getHours();
      h = h < 10 ? ('0' + h) : h;
      let m = date.getMinutes();
      m = m < 10 ? ('0' + m) : m;
      let s = date.getSeconds();
      s = s < 10 ? ('0' + s) : s;
      return y + '-' + MM + '-' + d;
    },
    price(value) {
      var toFixedNum = Number(value).toFixed(3);
      var realVal = toFixedNum.substring(0, toFixedNum.toString().length - 1);
      return realVal;
    },
    number(value) {
      var toFixedNum = Number(value).toFixed(0);
      return toFixedNum;
    }
  },
  methods: {
    //调整商品添加
    memberTypeClick() {
      if (this.checkPermission(['member-list']) == true) {
        this.memberType = true
      }
    },
    loadMenus() {
      getMenuTree().then(res => {
        res.data.forEach(list => {
          if (list.permission === 'product.list') {
            const loadWater = list.childrens.find(item => {
              return item.permission === 'waterTicket-list'
            })
            if (loadWater !== undefined) {
              this.isWaterShow = true

            }
          }
        })
        this.pay.forEach(item => {
          if (item.paymentPluginId == 'paperPayPlugin') {
            item.isShow = this.isWaterShow
          }
        })
      })

    },
    shopAddClick() {
      var _this = this
      if (_this.from.memberId == '') {
        eeui.toast('请先选择会员')
        return
      }
      eeui.openPage({
        url: 'root://pages/member/declaration/shopList.js',
        statusBarType: 'immersion',
        statusBarStyle: false
      }, result => {
        if (result.status == 'stop') {
          storage.getItem('productAdd', event => {
            if (event.result == 'success') {
              _this.historyData = []
              _this.itemList.forEach(function (item) {
                _this.historyData.push(item)
              })
              var product = JSON.parse(event.data)
              var goodsDetails = {}
              getHistoryList({memberId: this.from.memberId, productId: product.id})
                  .then((res) => {
                    if (!_this.isNull(res.data)) {
                      goodsDetails = {
                        productId: product.id,
                        name: product.name,
                        sn: product.sn,
                        cost: product.cost,
                        price: res.data[0].price,
                        subTotal: res.data[0].price,
                        unit: product.unit,
                        spec: product.spec1 + product.spec2,
                        discount: 0,
                        quantity: 1,
                        thumbnail: product.thumbnail
                      };
                      console.log(goodsDetails)
                      _this.itemList.push(goodsDetails)
                      _this.procuctFilter()
                    } else {
                      goodsDetails = {
                        productId: product.id,
                        name: product.name,
                        sn: product.sn,
                        cost: product.cost,
                        price: product.price,
                        subTotal: product.price,
                        unit: product.unit,
                        spec: product.spec1 + product.spec2,
                        discount: 0,
                        quantity: 1,
                        thumbnail: product.thumbnail
                      };
                      console.log(goodsDetails)
                      _this.itemList.push(goodsDetails)
                      _this.procuctFilter()
                    }
                  }).catch((error) => {
                console.log('11111')
                console.log(error);
              });
              console.log('2222')
            }
          })
          storage.removeItem('productAdd', event => {

          })
        }
      });
    },
    //商品过滤
    procuctFilter() {
      var _this = this
      let newfood = [];
      var temp = {};
      for (var i in this.itemList) {
        var key = this.itemList[i].productId;
        if (temp[key]) {
          temp[key].productId = temp[key].productId;
          temp[key].quantity = Number(temp[key].quantity) + Number(_this.itemList[i].quantity);
          temp[key].subTotal = parseFloat(this.itemList[i].price) * parseFloat(temp[key].quantity);
        } else {
          temp[key] = {};
          temp[key].productId = this.itemList[i].productId;
          temp[key].quantity = this.itemList[i].quantity;
          temp[key].subTotal = parseFloat(this.itemList[i].price) * parseFloat(temp[key].quantity);
        }
        temp[key].name = this.itemList[i].name;
        temp[key].sn = this.itemList[i].sn;
        temp[key].price = this.itemList[i].price;
        temp[key].cost = this.itemList[i].cost;
        temp[key].discount = this.itemList[i].discount;
        temp[key].spec = this.itemList[i].spec;
        temp[key].unit = this.itemList[i].unit;
        temp[key].thumbnail = this.itemList[i].thumbnail;
        temp[key].subType = this.itemList[i].subType
      }
      for (var k in temp) {
        newfood.push(temp[k])
      }
      this.itemList = newfood
      this.calculateClick()
    },
    //右划删除
    handleSwipe(e, index) {
      if (e.direction == "left") {
        this.goLeft(index);
      } else if (e.direction == "right") {
        this.goRight(index);
      }
    },

    goLeft(index) {
      let itemEl = this.$refs.itemDev[index];
      //第二左滑条目与前一次左滑条目相同时，不处理
      if (index == this.currentIndex) {
        return;
      }
      //当前有划出的条目的时候，左滑其他条目，当前的条目归位，
      if (this.currentIndex != -1) {
        this.goRight(this.currentIndex);
      }
      //左滑当前条目
      if (this.currentIndex != index) {
        animation.transition(itemEl, {
          styles: {
            transform: 'translate(-160px, 0px)',
            transformOrigin: 'center center'
          },
          duration: 200, //ms
          timingFunction: 'linear',
          delay: 0 //ms
        }, function () {
        });
        this.currentIndex = index;
      }
    },
    goRight(index, time = 200) {
      let itemEl = this.$refs.itemDev[index];
      animation.transition(itemEl, {
        styles: {
          transform: 'translate(0px, 0px)',
          transformOrigin: 'center center'
        },
        duration: time, //动画时间
        timingFunction: 'linear',//线性运动
        delay: 0 //ms
      }, function () {
      });
      this.currentIndex = -1;
    },

    removeItem(index) {
      this.goRight(index, 0);
      this.itemList.splice(index, 1)
      this.orderForm.itemList.splice(index, 1)
      if (this.itemList.length > 0) {
        this.calculateClick()
      }

    },
    //加减数量
    addClick(index) {
      var _this = this
      this.itemList[index].quantity = Number(this.itemList[index].quantity) + 1
      _this.procuctFilter()
    },
    reductionClick(index) {
      var _this = this
      if (this.itemList[index].quantity == 1) {
        eeui.toast('此商品最少添加一件')
        return
      }
      this.itemList[index].quantity = Number(this.itemList[index].quantity) - 1
      _this.procuctFilter()
    },
    numChange(index) {
      var _this = this
      eeui.input({
        title: "请输入数量",
        buttons: ["取消", "确定"],
        inputs: [{
          type: 'number',
          value: _this.orderForm.itemList[index].quantity,
          autoFocus: true
        },]
      }, function (result) {
        if (result.status == "click" && result.title == "确定") {
          console.log(result)
          if (result.data[0] == "") {
            _this.itemList[index].quantity = 1
          } else {
            _this.itemList[index].quantity = result.data[0]
          }
          _this.procuctFilter()
        }
      });
    },
    memoClick() {
      var _this = this
      eeui.input({
        title: "请输入备注",
        buttons: ["取消", "确定"],
        inputs: [{
          type: 'text',
          value: _this.orderForm.memo,
          autoFocus: true
        },]
      }, function (result) {
        if (result.status == "click" && result.title == "确定") {
          console.log(result)
          _this.orderForm.memo = result.data[0]
        }
      });
    },
    //支付方式选择
    switchClick(index) {
      var _this = this
      if (_this.amount == 0) {
        return
      }
      if (_this.pay[index].chk == false) {
        _this.pay[index].chk = true
        _this.pay[index].amount = _this.amount
        // _this.amount = 0
        _this.pay.forEach(function (item) {
          if (item.amount == 0) {
            item.chkType = true
          }
        })
      } else if (_this.pay[index].chk == true) {
        _this.pay[index].chk = false
        // _this.amount = _this.pay[0].amount
        _this.pay[index].amount = 0
        _this.pay.forEach(function (item) {
          item.chkType = false
        })
      }
    },
    //配送站点
    siteClick() {
      this.siteType = true
    },
    cencleSite() {
      this.siteType = false
    },
    completeSite(data) {
      this.siteType = false
      this.shopId = data.from.id
      this.shopName = data.from.name
      this.shopIndex = data.shopIndex
    },
    //配送人员
    personnelClick() {
      this.personnelType = true
    },
    completePersonnel(data) {
      this.personnelType = false;
      this.operatorId = data.from.id
      this.personnelName = data.from.name
      this.personnelIndex = data.personnelIndex
    },
    cenclePersonnel() {
      this.personnelType = false
    },
    //计算商品
    calculateClick() {
      var _this = this;
      _this.from.itemList = _this.itemList
      calculate(_this.from).then(response => {
        console.log(response)
        _this.orderForm = response.data.order
        _this.orderForm.itemList.forEach(function (item) {
          item.price = Number(item.price).toFixed(2)
        })
        _this.amount = response.data.amount
        _this.times = new Date().getSeconds()
        _this.paytimes = new Date().getSeconds()
        _this.pay.forEach(function (item) {
          item.chk = false
          item.amount = 0
          item.chkType = 0
        })
        this.methodName = '普通快递'
        this.methodIndex = 0
        if (!this.isNull(response.data.order.itemList)) {
          var packageForm = []
          response.data.order.itemList.forEach(function (item) {
            if (item.subType == 1) {
              packageForm.push(item)
            }
          })
          if (packageForm.length > 0) {
            _this.weekType = true
          } else {
            _this.weekType = false
          }
        }
        this.shippingMethod = response.data.shippingMethods.split(',')
        if (this.shippingMethod[0] == 0) {
          this.methodName = '普通快递';
          this.orderForm.shippingMethod = 0
        } else if (this.shippingMethod[0] == 1) {
          this.methodName = '到店自提';
          this.orderForm.shippingMethod = 1
        } else if (this.shippingMethod[0] == 2) {
          this.methodName = '同城配送';
          this.orderForm.shippingMethod = 2
        }
        if (!this.isEmptyString(response.data.couponCodeName)) {
          _this.couponCodeName = response.data.couponCodeName
        }
      }).catch(error => {
        console.log(_this.historyData)
        console.log(_this.itemList)
        _this.itemList = _this.historyData
      })
    },
    //支付计算
    changeClick(index) {
      var _this = this
      _this.pay.forEach(function (item) {
        item.amount = 0
        item.chk = false
        item.chkType = false
      })
      _this.paytimes = new Date().getSeconds()
      if (_this.orderForm.paymentVo[index].chk == false) {
        if (_this.amount != 0) {
          if (_this.amount >= _this.orderForm.paymentVo[index].balance) {
            _this.amount = (Number(_this.amount) - Number(_this.orderForm.paymentVo[index].balance)).toFixed(2)
            _this.orderForm.paymentVo[index].amount = _this.orderForm.paymentVo[index].balance
            if (_this.amount == 0) {
              _this.orderForm.paymentVo.forEach(function (item) {
                if (item.amount == 0) {
                  item.chkType = true
                }
              })
              _this.pay.forEach(function (item) {
                if (item.amount == 0) {
                  item.chk = true
                }
              })
              _this.$forceUpdate()
            }
          } else {
            _this.orderForm.paymentVo[index].amount = _this.amount
            _this.amount = 0;
            _this.orderForm.paymentVo.forEach(function (item) {
              if (item.amount == 0) {
                item.chkType = true
              }
            })
            _this.pay.forEach(function (item) {
              if (item.amount == 0) {
                item.chk = true
              }
            })
            _this.$forceUpdate()
          }
          _this.orderForm.paymentVo[index].chk = true;
        } else {
          _this.orderForm.paymentVo[index].chk = false;
          eeui.toast('本商品已无法抵用优惠')
        }
      } else {
        _this.orderForm.paymentVo[index].chk = false
        _this.orderForm.paymentVo.forEach(function (item) {
          item.chkType = false
        })
        _this.pay.forEach(function (item) {
          item.chk = false
        })
        _this.$forceUpdate()
        _this.amount = Number(_this.amount) + Number(_this.orderForm.paymentVo[index].amount)
        _this.amount = _this.amount.toFixed(2)
        _this.orderForm.paymentVo[index].amount = 0
      }
    },
    //保存订单
    createClick() {
      var _this = this
      if (this.isNull(_this.from.memberId)) {
        eeui.toast('请选择会员')
        return
      }

      if (this.isNull(_this.from.receiverId)) {
        eeui.toast('请选择地址')
        return
      }
      if (this.shopId == '') {
        eeui.toast('请选择配送站点')
        return
      }
      if (_this.orderForm.itemList.length == 0) {
        eeui.toast('商品不能为空')
        return
      }
      var pay = []
      _this.pay.forEach(function (item) {
        if (item.amount > 0) {
          pay.push(item)
        }
      });
      if (_this.amount > 0 && pay.length <= 0) {
        eeui.toast('请选择支付方式')
        return;
      }
      if (pay.length > 0) {
        pay[0].chk = true
      }

      // var paymentVoForm = []
      // pay.forEach(function (item) {
      //     var data = {
      //         chk: item.chk,
      //         paymentPluginName: item.paymentPluginName,
      //         balance: item.balance,
      //         paymentPluginId: item.paymentPluginId,
      //         amount: item.amount,
      //     }
      //     paymentVoForm.push(data)
      // })
      pay.forEach(function (item) {
        _this.$delete(item, 'isShow')
      })
      var paymentVo = _this.orderForm.paymentVo.concat(pay);
      console.log(paymentVo)
      paymentVo.forEach(function (item) {
        _this.$delete(item, 'chkType')
      })
      console.log(paymentVo)
      let formData = {
        taxType: _this.orderForm.taxType,
        memberId: _this.orderForm.memberId,
        orderDate: _this.orderForm.orderDate,
        operatorId: _this.operatorId,
        shopId: _this.shopId,
        orderMethod: _this.orderForm.orderMethod,
        shippingMethod: _this.orderForm.shippingMethod,
        officeId: _this.orderForm.officeId,
        areaName: _this.orderForm.areaName,
        address: _this.orderForm.address,
        areaId: _this.orderForm.areaId,
        receiverId: _this.orderForm.receiverId,
        memo: _this.orderForm.memo,
        phone: _this.orderForm.phone,
        consignee: _this.orderForm.consignee,
        freight: _this.orderForm.freight,
        amountPayable: _this.orderForm.amountPayable,
        amountPaid: _this.orderForm.amountPaid,
        // paymentMethod: _this.form.paymentMethod,
        subPrice: _this.orderForm.subPrice,
        subQuantity: _this.orderForm.subQuantity,
        offsetAmount: _this.orderForm.offsetAmount,
        // pointDiscount: _this.form.pointDiscount,
        paymentVo: paymentVo,
        itemList: _this.orderForm.itemList,
        enterpriseId:_this.orderForm.enterpriseId,
      };
      _this.payType = true
      _this.payTitle = '加载中'
      console.log('1111')
      console.log(formData)
      saveAndConfirm({shippingEmployeeId:this.operatorId},formData).then(
          res => {
            console.log(res)
            _this.payType = false
            _this.payTitle = '提交订单'
            if (res.type == 'success') {
              eeui.closePage()
              eeui.openPage({
                    url: 'root://pages/member/declaration/complete.js',
                    statusBarType: 'immersion',
                    statusBarStyle: false
                  },
                  (result) => {

                  }
              );
              // _this.confirmClick(res.data.id, res.data.itemList)
            }
          }
      ).catch(error => {
        // console.log(error)
        // eeui.toast(error.content)
        _this.payType = false
        _this.payTitle = '提交订单'
//        eeui.closePage()
      })
    },
    // 自动接单
    confirmClick(id, itemList) {
      var _this = this;
      if (_this.orderForm.shippingMethod == 0) {
        _this.operatorId = ''
      }
      itemList.forEach(item => { // 初始化发货数量
        item.shippedQuantity = item.availableShippedQuantity
      })
      var form = {
        shopId: _this.shopId,
        orderDate: _this.shippingDate,
        shippingEmployeeId: _this.operatorId,
        weekTime: _this.weexTime,
      };
      shipping(id, JSON.stringify(itemList), form).then(response => {
        eeui.toast(response.content)
        // storage.setItem('orderShipping', 'true', event => {
        //
        // })
      }).catch(error => {
        console.log(error)
      })
    },
    //选择会员
    memberClick() {
      var _this = this
      var addressType = true
      eeui.openPage({
            url: 'root://pages/member/list.js',
            statusBarType: 'immersion',
            params: addressType,
            statusBarStyle: false
          },
          (result) => {
            if (result.status == 'stop') {
              storage.getItem('address', event => {
                if (event.result == 'success') {
                  if (!this.isEmptyString(event.data)) {
                    var address = JSON.parse(event.data)
                    _this.memberName = address.name
                    _this.memberPhone = address.mobile
                    _this.from.memberId = address.id
                    _this.from.address = ''
                    _this.from.areaId = ''
                    _this.from.phone = ''
                    _this.from.consignee = ''
                    _this.from.areaName = ''
                    _this.from.receiverId = ''
                    _this.addressListClick()
                  }
                }
              })
              storage.removeItem('address', event => {
              })
            }
          }
      );
    },
    //后天无返回所需参数
    receiverLocationClick(data) {
      var _this = this
      receiverLocation({receiverId: data}).then(
          res => {
            console.log(res)
            _this.operatorId = res.data.mapLine.shippingEmployeeId
            _this.shopId = res.data.mapLine.shopId
            _this.shopName = res.data.shopName
            _this.personnelName = res.data.shippingEmployeeName
          }
      ).catch(error => {

      })
    },
    //配送方式
    methodClick() {
      this.methodType = !this.methodType
    },
    cencleMethod() {
      this.methodType = false
    },
    completeMethod(data) {
      var _this = this
      this.methodType = false
      if (!_this.isNull(data.from)) {
        _this.methodName = data.from.name
        _this.orderForm.shippingMethod = data.from.status
      }
      this.methodIndex = data.methodIndex
      console.log(data)
    },
    saveClick(data) {
      var _this = this
      _this.weexDate = []
      _this.weexTime = data.weexTime
      if (data.weexData.length != 0) {
        _this.weexDate = data.weexData
      } else {
        _this.weexDate = [
          {title: '请选择配送日期'}
        ]
      }
      this.packageType = false
    },
    packageClick() {
      this.packageType = !this.packageType
    },
    cenclePackage() {
      this.packageType = false
    },
    cenclecoupons() {
      this.couponsType = false
    },
    couponsClick() {
      if (this.orderForm.discount == 0) {
        eeui.toast('暂无优惠')
      } else {
        this.couponsType = true
      }
    },
    addressListClick() {
      var _this = this
      addressList({memberId: this.from.memberId})
          .then((res) => {
            res.data.data.forEach(function (item) {
              if (item.isDefault == true) {
                _this.from.address = item.address
                _this.from.areaId = item.areaId
                _this.from.phone = item.phone
                _this.from.consignee = item.consignee
                _this.from.areaName = item.areaName
                _this.from.receiverId = item.id
                _this.receiverLocationClick(item.id)
                _this.historyClick()
              }
            })
          })
          .catch((error) => {
            console.log(error);
          });
    },
    addressClick() {
      var _this = this
      var form = {
        addressType: true,
        memberId: _this.from.memberId
      }
      eeui.openPage({
            url: 'root://pages/member/address/address.js',
            statusBarType: 'immersion',
            params: form,
            statusBarStyle: false
          },
          (result) => {
            if (result.status == 'stop') {
              storage.getItem('addressList', event => {
                if (event.result == 'success') {
                  if (!this.isEmptyString(event.data)) {
                    var address = JSON.parse(event.data)
                    _this.from.address = address.address
                    _this.from.areaId = address.areaId
                    _this.from.phone = address.phone
                    _this.from.consignee = address.consignee
                    _this.from.areaName = address.areaName
                    _this.from.receiverId = address.id
                    _this.receiverLocationClick(address.id)
                    if (_this.itemList.length > 0) {
                      _this.calculateClick()
                    }
                  }
                }
              })
              storage.removeItem('addressList', event => {
              })
            }
          }
      );
    },
    priceChange(index) {
      var _this = this
      eeui.input({
        title: "请输入价格",
        buttons: ["取消", "确定"],
        inputs: [{
          type: 'number',
          value: _this.orderForm.itemList[index].price,
          autoFocus: true,
        },]
      }, function (result) {
        if (result.status == "click" && result.title == "确定") {
          console.log(result)
          if (result.data[0] == '') {
            _this.itemList[index].price = 0
          } else {
            _this.itemList[index].price = result.data[0]
          }
          _this.calculateClick()
        }
      });
    },
    isMaskChange(data) {
      console.log(data)
      this.changePriceType = false
      this.itemList[this.changePriceIndex].price = data
      this.calculateClick()
    },
    isMaskCancel() {
      this.changePriceType = false
    },
    priceInputRight(index, id) {
      this.changePriceType = !this.changePriceType
      this.changePriceIndex = index
      this.getHistoryListClick(id)
    },
    getHistoryListClick(id) {
      var _this = this
      _this.historyForm = []
      getHistoryList({memberId: this.from.memberId, productId: id})
          .then((res) => {
            console.log('11111')
            console.log(res)
            console.log('2222')
            _this.historyForm = res.data
          }).catch((error) => {
        console.log('11111')
        console.log(error);
      });
    },
    memberDetailsClick() {
      var _this = this
      eeui.openPage({
        url: 'root://pages/member/memberInfo/memberInfo.js',
        params: _this.from.memberId,
        statusBarType: 'immersion',
        statusBarStyle: false
      }, result => {

      })
    },
    historyClick() {
      var _this = this
      last({memberId: this.from.memberId})
          .then((res) => {
            console.log('11111')
            console.log(res)
            console.log(res.data)
            console.log('2222')
            if (res.data != null && res.data.itemList.length > 0) {
              console.log('111222')
              _this.itemList = res.data.itemList
              _this.itemList.forEach(function (item) {
                item.quantity = Number(item.quantity).toFixed(0)
              })
              _this.procuctFilter()
            }

          }).catch((error) => {
        console.log('11111')
        console.log(error);
      });
    },
  }
}
</script>
<style lang="css" src="../../../style/wx.css"/>
<style scoped>
.app, body {
  background-color: rgba(248, 248, 248, 0.8);
}

.app {
  flex: 1
}

.tabbar {
  flex: 1;
  width: 750px;
}

.navbar {
  width: 750px;
  height: 100px;
}

.text {
  font-size: 26px;
}

.address_box {
  width: 690px;
  /*height: 226px;*/
  background-color: rgba(255, 255, 255, 1);
  border-radius: 16px;
  margin-left: 30px;
  margin-top: 30px;
  position: relative;
  box-sizing: border-box;
  padding-left: 36px;
  padding-right: 36px;
  padding-top: 36px;
  padding-bottom: 36px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.address_img {
  width: 690px;
  height: 226px;
  position: absolute;
  bottom: -6px;
  left: 0;
}

.address_top {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.address_label {
  width: 66px;
  height: 34px;
  border-width: 1px;
  border-style: solid;
  border-color: rgba(231, 91, 83, 1);
  border-radius: 2px;
  /* padding: 2px; */
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 20px;
}

.address_label_item {
  width: 62px;
  height: 30px;
  background-color: rgba(231, 91, 83, 1);
  border-radius: 1px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}

.address_label_title {
  font-size: 20px;
  font-weight: 400;
  color: rgba(255, 255, 255, 1);
}

.address_name {
  font-size: 32px;
  font-weight: 500;
  color: rgba(26, 26, 30, 1);
  display: block;
  /*margin-left: 20px;*/
}

.address_phone {
  font-size: 28px;
  font-weight: 400;
  color: rgba(26, 26, 30, 1);
  opacity: 0.5;
  display: block;
  margin-left: 20px;
}

.address_content {
  width: 557px;
  /*height: 69px;*/
  font-size: 28px;
  font-weight: 400;
  color: rgba(26, 26, 30, 1);
  line-height: 42px;
  display: block;
  position: relative;
  margin-top: 10px;
}

.address_right {
  position: absolute;
  top: 0;
  right: 20px;
  bottom: 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  /*background-color: red;*/

}

.address_right_icon {
  font-size: 40px;
  color: #888888;
  width: 30px;
  height: 100px;
}

.submit_product {
  width: 690px;
  background-color: rgba(255, 255, 255, 1);
  border-radius: 16px;
  margin-top: 30px;
  margin-left: 30px;
  box-sizing: border-box;
  padding-top: 20px;
  padding-left: 25px;
  padding-right: 25px;
  padding-bottom: 20px;
  overflow: hidden;
}

.submit_product_content_box {
  display: flex;
  flex-direction: row;
  position: relative;
  margin-bottom: 40px;
  width: 800px;
  overflow: hidden;
}

.submit_product_content_img {
  width: 170px;
  height: 170px;
  background: rgba(250, 250, 250, 1);
  border-radius: 4px;
}

.submit_product_content {
  display: flex;
  flex-direction: column;
  /* justify-content: center; */
  width: 450px;
  /*margin-left: 20px;*/
}

.submit_product_content_title {
  font-size: 28px;
  font-weight: 400;
  color: rgba(26, 26, 30, 1);
  line-height: 36px;
  display: block;
  text-overflow: ellipsis;
  lines: 2
}

.submit_product_content_subtitle {
  font-size: 24px;
  font-weight: 400;
  color: rgba(26, 26, 30, 1);
  line-height: 36px;
  opacity: 0.3;
  lines: 1;
  text-overflow: ellipsis;
}

.submit_product_content_label {
  width: 134px;
  height: 34px;
  background: rgba(250, 243, 243, 1);
  border-radius: 1px;
  /* margin-top: 16px; */
  display: flex;
  justify-content: center;
  align-items: center;
}

.submit_product_content_labelTitle {
  font-size: 20px;
  font-weight: 400;
  color: rgba(26, 26, 30, 1);
  line-height: 48px;
  opacity: 0.5;
}

.submit_product_number {
  /*position: absolute;*/
  /*right: 0;*/
  /*top: 0;*/
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 450px;
}

.submit_product_priceIcon {
  font-size: 18px;
  font-weight: 400;
  color: rgba(26, 26, 30, 1);
  line-height: 42px;
  display: block;
  height: 36px;
}

.submit_product_priceTitle {
  font-size: 28px;
  font-weight: 400;
  color: rgba(26, 26, 30, 1);
  line-height: 36px;
  display: block;
}

.submit_product_quantity {
  font-size: 24px;
  font-weight: 400;
  color: rgba(26, 26, 30, 1);
  line-height: 28px;
  opacity: 0.5;
  text-align: right;
  display: block;
  width: 100%;
}

.submit_product_original_priceIcon {
  font-size: 14px;
  font-weight: 400;
  color: rgba(26, 26, 30, 1);
  line-height: 42px;
  opacity: 0.3;
  display: block;
  height: 36px;
}

.submit_product_original_priceTitle {
  font-size: 24px;
  font-weight: 400;
  color: rgba(26, 26, 30, 1);
  line-height: 36px;
  opacity: 0.3;
  display: block;
}

.submit_product_details {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 20px;
}

.submit_product_details_title {
  width: 170px;
  display: block;
  font-size: 28px;
  text-align: right;
}

.submit_product_detailsBox {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  width: 450px;
  margin-left: 20px;
}

.submit_product_freightBox {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  width: 540px;
  margin-left: 20px;
}

.submit_product_details_subtitle {
  font-size: 28px;
  color: rgba(26, 26, 30, 0.3);
  line-height: 50px;
}

.submit_product_details_Introduction {
  font-size: 24px;
  line-height: 26px;
  color: rgba(26, 26, 30, 1);
}

.submit_product_details_IntroductionTwo {
  font-size: 24px;
  line-height: 26px;
  color: rgba(231, 91, 83, 1);
}

.submit_product_details_Icon {
  font-size: 40px;
  color: #888888;
  width: 30px;
  height: 50px;
  padding-top: 2px;
}

.submit_product_details_IconTwo {
  font-size: 25px;
  color: #888888;
  width: 30px;
  height: 24px;
  padding-top: 2px;
}

.submit_product_detailsBox_input {
  width: 450px;
  font-size: 28px;
  padding-bottom: 3px;
  color: #888888;
}

.submit_payMethod {
  width: 690px;
  padding: 25px;
  box-sizing: border-box;
  margin-left: 30px;
  margin-top: 30px;
  background-color: white;
  border-radius: 16px;
}

.submit_payMethodTwo {
  width: 690px;
  box-sizing: border-box;
  margin-left: 30px;
  margin-top: 30px;
  background-color: white;
  border-radius: 16px;
  padding-left: 25px;
  padding-right: 25px;
}

.submit_payMethod_Header_Title {
  font-size: 34px;
  font-weight: 400;
  color: rgba(26, 26, 30, 1);
}

.submit_payMethod_Content {
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  align-items: center;
  margin-top: 30px;
}

.submit_payMethod_Content_Column {
  display: flex;
  flex-direction: column;
}

.submit_payMethod_Content_Title {
  font-size: 28px;
  font-weight: 400;
  color: rgba(26, 26, 30, 1);
  display: block;
}

.submit_payMethod_Content_SubTitle {
  font-size: 24px;
  font-weight: 400;
  color: rgba(231, 91, 83, 1);
  line-height: 36px;
  display: block;
  margin-top: 10px;
}

.submit_payMethod_Content_Date {
  font-size: 24px;
  font-weight: 400;
  color: rgba(26, 26, 30, 0.3);
  line-height: 36px;
  display: block;
  margin-top: 10px;
}

.submit_product_content_PreferentialPrice {
  font-size: 24px;
  font-weight: 500;
  color: rgba(231, 91, 83, 1);
  line-height: 36px;
  margin-right: 10px;
  /* display: block; *//* margin-top: 20px; */
}

.submit_product_content_row {
  display: flex;
  flex-direction: row;
  align-items: center;
  position: absolute;
  bottom: 0;
  left: 190px;
}

.submit_subtotal {
  width: 640px;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
}

.submit_subtotal_subtitle {
  font-size: 24px;
  color: rgba(0, 0, 0, 0.5);
  margin-right: 5px;
  letter-spacing: 5px;
}

.submit_subtotal_title {
  font-size: 24px;
}

.submit_subtotal_Icon {
  font-size: 18px;
  color: rgba(231, 91, 83, 1);
  line-height: 30px;
  display: block;
  height: 30px;
}

.submit_subtotal_price {
  font-size: 24px;
  color: rgba(231, 91, 83, 1);
}

.submit_botton {
  width: 750px;
  height: 96px;
  background-color: rgba(248, 248, 248, 1);
  position: fixed;
  bottom: 0;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  z-index: 999
}

.submit_botton_subtitle {
  font-size: 24px;
  font-weight: 400;
  color: rgba(26, 26, 30, 1);
  line-height: 36px;
  opacity: 0.5;
  margin-right: 5px;
  letter-spacing: 5px;
}

.submit_botton_price {
  font-size: 32px;
  font-weight: bold;
  color: rgba(231, 91, 83, 1);
  line-height: 36px;
  margin-right: 5px;
}

.submit_botton_icon {
  font-size: 24px;
  font-weight: bold;
  color: rgba(231, 91, 83, 1);
  line-height: 38px;
  display: block;
  height: 36px;
}

.submit_botton_box {
  width: 198px;
  height: 74px;
  border-radius: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: 10px;
  margin-right: 25px;
  font-size: 32px;
  color: white;
}

.submit_botton_box_no {
  width: 198px;
  height: 74px;
  background-image: linear-gradient(129deg, rgb(179, 178, 177), rgb(231, 231, 230));
  border-radius: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: 10px;
  margin-right: 25px;
  font-size: 32px;
  color: white;
}

.submit_botton_box_title {
  font-size: 32px;
  font-weight: 400;
}

.address_no {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.address_no_img {
  width: 80px;
  height: 80px;
}

.address_no_title {
  font-size: 32px;
  font-weight: 400;
  color: rgba(26, 26, 30, 1);
  margin-left: 10px;
}

.submit_isMask {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.3);
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
}

.submit_isMask_content {
  width: 670px;
  background-color: rgba(255, 255, 255, 1);
  border-radius: 16px;
  padding-top: 70px;
  padding-left: 40px;
  padding-right: 40px;
  padding-bottom: 40px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  overflow: scroll;
}

.submit_isMask_header {
  width: 413px;
  display: flex;
  justify-content: center;
  padding-bottom: 30px;
}

.submit_isMask_header_title {
  font-size: 32px;
  font-weight: 500;
  color: rgba(26, 26, 30, 1);
  line-height: 42px;
  text-align: center;
}

.submit_isMask_product {
  display: flex;
  flex-direction: row;
  margin-bottom: 30px;
}

.submit_isMask_product_img {
  width: 170px;
  height: 170px;
  background-color: rgba(250, 250, 250, 1);
  border-radius: 4px;
}

.submit_isMask_product_column {
  display: flex;
  flex-direction: column;
  margin-left: 20px;
  width: 400px;
}

.submit_isMask_product_title {
  font-size: 24px;
  font-weight: 400;
  color: rgba(26, 26, 30, 1);
  line-height: 36px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
}

.submit_isMask_product_subtitle {
  font-size: 24px;
  font-weight: 400;
  color: rgba(26, 26, 30, 1);
  line-height: 36px;
  opacity: 0.3;
  margin-top: 16px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.submit_isMask_product_quantity {
  font-size: 24px;
  font-weight: 400;
  color: rgba(26, 26, 30, 1);
  line-height: 36px;
  opacity: 0.5;
  margin-top: 16px;
}

.isMask_botton {
  width: 670px;
  height: 158px;
  border-top-style: solid;
  border-top-width: 1px;
  border-top-color: rgba(0, 0, 0, 0.05);
  position: absolute;
  bottom: 0;
  left: 0;
  padding-left: 40px;
  padding-right: 40px;
  box-sizing: border-box;
  justify-content: space-between;
  align-items: center;
  display: flex;
  flex-direction: row;
  background-color: white;
}

.isMask_botton_left {
  width: 272px;
  height: 74px;
  background-image: linear-gradient(to bottom, rgba(196, 198, 204, 1), rgba(213, 215, 219, 1));
  border-radius: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.isMask_botton_left_title {
  font-size: 32px;
  font-weight: 400;
  color: rgba(255, 255, 255, 1);
}

.isMask_botton_right {
  width: 282px;
  height: 74px;
  /* background: linear-gradient(129deg, rgba(233, 88, 79, 1), rgba(241, 114, 80, 1)); */
  border-radius: 4px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.isMask_botton_right_title {
  font-size: 32px;
  font-weight: 400;
  /* color: rgba(255, 255, 255, 1); */
}

.submit_payMethod_Content_Row {
  display: flex;
  flex-direction: row;
}

.submit_payMethod_Content_botton {
  width: 30px;
  height: 30px;
  border-radius: 50%;
}

.submit_payMethod_ContentTwo {
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  align-items: center;
  border-bottom-color: rgba(0, 0, 0, 0.2);
  border-bottom-width: 1px;
  border-bottom-style: solid;
  padding-top: 30px;
  padding-bottom: 30px;
}

.submit_payMethod_ContentThree {
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  align-items: center;
  padding-top: 30px;
  padding-bottom: 30px;
}


.submit_payMethod_Content_Img {
  width: 30px;
  height: 30px;
  margin-right: 20px;
}

.submit_payMethod_Content_ImgTwo {
  width: 40px;
  height: 30px;
  margin-right: 10px;
  position: relative;
  left: -4px;
}

.porduct_add {
  height: 60px;
  border-style: solid;
  border-width: 1px;
  border-color: rgba(0, 0, 0, 0.2);
  border-radius: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 20px;
}

.porduct_add_title {
  font-size: 28px;
  color: rgba(0, 0, 0, 0.5);
}

.product_botton_left {
  border-top-left-radius: 6px;
  border-bottom-left-radius: 6px;
  border-right-color: rgba(0, 0, 0, 0.2);
  border-right-width: 1px;
  border-right-style: solid;
  width: 60px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.product_botton_right {
  border-top-right-radius: 6px;
  border-bottom-right-radius: 6px;
  border-left-color: rgba(0, 0, 0, 0.2);
  border-left-width: 1px;
  border-left-style: solid;
  width: 60px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.product_botton_input {
  width: 70px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 22px;
  color: rgba(0, 0, 0, 0.5);
  text-align: center;
}

.product_price_input {
  width: 100px;
  height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;

}

.product_price_input_Title {
  font-size: 22px;
  color: rgba(0, 0, 0, 0.5);
  text-align: center;
}

.product_botton_box {
  display: flex;
  flex-direction: row;
  border-color: rgba(0, 0, 0, 0.2);
  border-width: 1px;
  border-style: solid;
  border-radius: 6px;
  margin-top: 5px;
  position: relative;
}

.product_botton_icon {
  font-size: 20px;
  font-family: iconfont2;
  color: rgba(0, 0, 0, 0.5);
}

.shippingInfo {
  display: flex;
  flex-direction: row;
  align-items: center;
  /*margin-bottom: 20px;*/
}

.shippingInfo_title {
  width: 170px;
  display: block;
  font-size: 30px;

}

.shippingInfo_box {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  width: 450px;
  margin-left: 20px;
}

.shippingInfo_subtitle {
  font-size: 28px;
  color: rgba(26, 26, 30, 0.3);
  line-height: 50px;
}

.isMask_Price {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 300px;
  height: 115px;
  border-radius: 6px;
  border-color: rgba(0, 0, 0, 0.1);
  border-style: solid;
  border-width: 1px;
  background-color: white;
  overflow: auto;
}

.isMask_Price_box {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 20px;
  box-sizing: border-box;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-bottom-color: rgba(0, 0, 0, 0.1);
}

.isMask_Price_header {
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 20px;
  box-sizing: border-box;
  border-bottom-style: solid;
  border-bottom-width: 1px;
  border-bottom-color: rgba(0, 0, 0, 0.1);
}

.isMask_Price_header_title {
  font-size: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  flex: 1;
}

.isMask_Price_box_price {
  margin-left: 10px;
  font-size: 28px;
  flex: 1;
  text-align: center;
}

.isMask_Price_box_Two {
  width: 600px;
  height: 400px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.isMask_Price_box_Two_Titlt {
  font-size: 30px;
}

.details_lines {
  width: 2px;
  height: 28px;
  background-color: rgba(0, 0, 0, 0.2);
  margin-left: 20px;
}

.details_right_copyTwo {
  font-size: 28px;
  color: rgba(0, 0, 0, 0.4);
  margin-left: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 40px;
}

.history_box {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0, 0, 0, 0.4);
  display: flex;
  justify-content: center;
  align-items: center;
}

.history_content {
  width: 600px;
  height: 400px;
  background-color: white;
  border-radius: 6px;
}

.history_cancel_box {
  width: 600px;
  margin-bottom: 20px;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
}

.history_cancel_icon {
  font-family: iconfont2;
  font-size: 40px;
  color: white;
}
</style>
